<template>
  <a-card :bordered="false">
    <Form ref="formRef" @search="search" class="form-container" />

    <Table ref="tableRef" :table-args="tableArgs" />
  </a-card>
</template>

<script>
import search from '@/utils/mixins/search/index'
import Form from './Form.vue'
import Table from './Table'

export default {
  components: {
    Form,
    Table,
  },

  mixins: [search],

  methods: {
    handleSubmit () {
      return new Promise((resolve, reject) => {
        this.tableRef.addGroupUsers()
          .then(data => {
            this.tableRef.selectChangeReset()
            resolve(data)
          })
          .catch(error => {
            reject(error)
          })
      })
    },

    submitCallBack () {
      this.$emit('update')
    },

    resetFields () {
      const formRef = this.$refs.formRef

      formRef.handleReset()
    },
  },
}
</script>

<style lang="scss" scoped>
.form-container {
  margin-bottom: $margin-xs;
}
</style>
